/*
* appearance-none 去除复选框默认样式
*
* */
export default function Page(){
  return (
    <div className={"w-44 p-5 aspect-[2/1] bg-slate-200 mx-auto mt-20 relative rounded-3xl flex justify-start items-center has-[:checked]:justify-end"}>
      <input className={"appearance-none absolute inset-0 cursor-pointer opacity-0"} type={"checkbox"}/>
      <span className={"size-12 bg-purple-700 rounded-full"}></span>
    </div>
  )
}
